<template>
	<view>
		<view class="wrap-home-tool flex column">
			<view class="wrap-up-arrow" v-if="isShowArrow" @click.stop="$emit('onUpArrow')">
				<image class="arrow" :src="$staticImagePath('home/up_arrow.png')" />
							
				<view class="title f-20 flex align-center just-center">返回顶部</view>
			</view>
			
			<view class="wrap-publish-tool" @click.stop="onPublish">
				<image class="img" :src="$staticImagePath('common/publish.png')" />
			
				<view class="title f-20 flex align-center just-center">我要发布</view>
			</view>
		</view>

		<publishPopup :isShow.sync="isShowPublishPopup" />
	</view>
</template>

<script>
	import publishPopup from "./publishPopup.vue";
	export default {
		components: {
			publishPopup,
		},
		props: {
			/**
			 * 是否显示箭头
			 */
			isShowArrow: {
				type: Boolean,
				default: false,
			}
		},
		data() {
			return {
				isShowPublishPopup: false,
			};
		},
		methods: {
			/**
			 * 发布
			 */
			onPublish() {
				if (this.$filters.isLogin()) {
					this.isShowPublishPopup = true;
				}
			},
		},
	};
</script>

<style lang="scss" scoped>
	.wrap-home-tool {
		position: fixed;
		right: 20rpx;
		bottom: 20rpx;
		overflow: hidden;
		z-index: 99;
		gap: 30rpx;
		
		.wrap-publish-tool {
			width: 108rpx;
			height: 108rpx;
			overflow: hidden;
			position: relative;
		
			.img {
				width: 108rpx;
				height: 108rpx;
			}
		}
		
		.wrap-up-arrow {
			width: 108rpx;
			height: 108rpx;
			overflow: hidden;
			position: relative;
			
			.arrow {
				width: 108rpx;
				height: 108rpx;
			}
		}
		
		.title {
			position: absolute;
			bottom: 20rpx;
			left: 0;
			width: 100%;
			color: white;
		}
	}
</style>
